﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>TianDi Map</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/tundra/tundra.css"/>
	<link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
	
    <style>
        html, body, #map {
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
    <script type="text/javascript">
        dojoConfig = {
            parseOnLoad: true,
            packages: [{
                name: 'tdlib',
                location: this.location.pathname.replace(/\/[^/]+$/, "")+"/tdlib"

            }]
        };
		//document.write(this.location.pathname.replace(/\/[^/]+$/, "")+"/tdlib");
    </script>
	<script src="https://js.arcgis.com/3.20/"></script>
    <script>
        var map;
        require(["esri/map",
                "tdlib/TDMapLayer",
                "tdlib/TDMapAnnoLayer",
                "esri/layers/FeatureLayer",
                "esri/geometry/Point",
                "dojo/domReady!"],
            function (Map,
                      TDTLayer,
                      TDTAnnoLayer,
                      FeatureLayer,
                      Point
            ){
                map = new Map("map", { logo: false });
                var basemap = new TDTLayer();
                map.addLayer(basemap);
                var annolayer = new TDTAnnoLayer();
                map.addLayer(annolayer);
 
                var pt = new Point(103.847, 36.0473);
                map.centerAndZoom(pt, 3);
            });
    </script>
</head>
<body>
<p id="map"></p>
</body>
</html>